class Details {
    constructor(ele) {
        this.ele = ele;
        this.init();
    }
    init() {
        //获取传递过来的url参数
        this.WareSkuCode = location.search.split('=')[1];

        //渲染商品详情
        this.render();



    }
    async render() {
        this.data = await pAjax({
            url: '../json/data11.json'
        });
        this.data = JSON.parse(this.data).Data;
        // console.log(this.data);
        for (let i = 0; i < this.data.length; i++) {
            if (this.data[i].WareSkuCode == this.WareSkuCode) {
                console.log(this.data[i]);
                console.log(this.WareSkuCode);

                this.str = `<div class="enlarge_box">
                <div class="show">
                    <img src="${this.data[i].Pic800}">
                    <div class="mask"></div>
                </div>
                <p class="tip"><span>温馨提示：</span>图片均为康爱多对原品的真实拍摄，仅供参考；如遇新包装上市可能存在上新滞后，请以实物为准。</p>
                <div class="enlarge"></div>
            </div>
            <div class="details">
                <h3 class="WareName"><i></i>${this.data[i].WareName}</h3>
                <p class="Advertisement">${this.data[i].Advertisement}<span>防疫用品一站购，省心过年→</span></p>
                <div class="warePrice">
                    <h5>会员价</h5><mark class="salePrice">￥${this.data[i].SalePrice}</mark><span class="marketPrice">￥${this.data[i].MarketPrice}</span>
                </div>
                <div class="commonName">
                    <h5>通用名</h5><span>${this.data[i].commonName}</span></div>
                <div class="num">
                    <h5>批准文号</h5>国药准字Z200954382<span>（国家药品监督管理局）</span></div>
                <div class="company">
                    <h5>生产企业</h5>贵州万顺堂药业有限公司</div>
                <div class="br"></div>
                <div class="specs">
                    <h5>规格</h5><span>${this.data[i].specs}</span></div>
                <div class="quantity_wrap">
                    <h5>数量</h5>
                    <div class="quantity">
                        <button class="reduce">-</button>
                        <input type="text" name="" id="" class="inp-quantity" value="1">
                        <button class="add">+</button>
                    </div>
                    <span>现在有货</span><i>（支持79元包邮）</i>
                </div>
                <div class="addCar" WareSkuCode="${this.data[i].WareSkuCode}">加入购物车</div>
                <div class="promise_wrap">
                    <h5>承诺</h5>
                    <ul class="promise">
                        <li>正品保证</li>
                        <li>专业药师</li>
                        <li>隐私包装</li>
                        <li>货到付款</li>
                        <li>退换无忧</li>
                    </ul>
                </div>
            </div>
            <div class="details_right">
                <img src="../images/details-right.png" alt="">
            </div>`;
                this.ele.html(this.str);
                $('.enlarge').css('backgroundImage', `url(${this.data[i].Pic800})`);
                break;
            }


        }
        //加入购物车时跳转到购物车
        this.addCar = $('.addCar');
        console.log(1);
        this.addCar.on('click', () => {
            location.replace(`./car.html?WareSkuCode=1`);
        })


        new Enlarge('.enlarge_box');
    }
}

new Details($('main'));